<template>
  <view class="container">
    <view class="example">
      <uni-forms ref="form" :model="formData" labelWidth="80px">
        <uni-forms-item label="内部码" name="id" class="item-margin">
          <uni-easyinput v-model="formData.id" placeholder="内部码" focus @confirm="focusInput" />
        </uni-forms-item>
        <uni-forms-item label="测试结果" name="balance" class="margin0">
		  <uni-easyinput style="margin-bottom: 0" type="textarea" autoHeight v-model="formData.balance" ref="nextFocus" placeholder="请输入"></uni-easyinput>
		</uni-forms-item>
      </uni-forms>
    </view>
	
	<view class="footer-btn">
		<button type="primary" @click="submitForm">提交</button>
	</view>
  </view>
</template>

<script>
	import { updateBalanceTest } from "@/api/longyi/balanceTest/Index.js"
	
	export default {
	  data() {
	    return {
		  formData: {
		      id: '',
		      balance: ''
		    },
			balanceMsg: '',
			loading: false,
	      rules: {
	        id: {
	          rules: [{
	            required: true,
	            errorMessage: '内部码不能为空'
	          }]
	        }
	      }
	    }
	  },
	  onReady() {
	    this.$refs.form.setRules(this.rules)
	  },
	  methods: {
		  submitForm() {
		  	// console.log(this.formData)
		  	  updateBalanceTest(this.formData).then(response => {
				this.balanceMsg = response.data
		  		// console.log(response)
				this.formData.id = ''
				this.formData.balance = ''
				this.$modal.msgSuccess("操作成功！")
		  	  })
		  },
		  focusInput () {
			  this.$nextTick(() => {
				   this.$refs.nextFocus.focused = true
			   })
	
		    }
	  }
	}
</script>

<style lang="scss" scoped>
  .example {
    padding: 15px;
    background-color: #fff;
	margin: 10px auto;
	.item-margin.is-direction-left {
	    margin-bottom: 15px !important;
	}
	.margin0.is-direction-left {
	    margin-bottom: 0 !important;
	}
  }
  .footer-btn{
	  padding: 15px;
	  background-color: #fff;
	  margin-top: 66px;
	  position: fixed;
	  width: 100%;
	  bottom: 0;
  }
  .container {
      overflow: hidden;
  }
  
</style>